<template>
    <app-layout>
        <app-rich-text :content="setting.recruit_content"></app-rich-text>
        <view class="placeholder"></view>
        <view class="apply safe-area-inset-bottom">
            <view class="apply-btn" :style="{'background-color': getTheme.color}" @click="toApply">立即申请</view>
        </view>
    </app-layout>
</template>

<script>
    import {mapGetters, mapState} from 'vuex';
    import appRichText from "../../../components/basic-component/app-rich/parse.vue";

    export default {
        data() {
            return {
                setting: {},
            }
        },
        computed: {
            ...mapGetters('mallConfig', {
                getTheme: 'getTheme',
            })
        },
        components: {
            "app-rich-text": appRichText
        },
        methods: {
            toApply() {
                this.stopLoad = true;
                uni.navigateTo({
                    url: '/plugins/community/apply/apply'
                });
            },
            getSetting() {
                let that = this;
                that.$request({
                    url: that.$api.community.setting,
                }).then(response=>{
                    if(response.code == 0) {
                        that.setting = response.data;
                        uni.setNavigationBarTitle({
                            title: that.setting.recruit_title
                        });
                    }else {
                        that.$hideLoading();
                        uni.showToast({
                            title: response.msg,
                            icon: 'none',
                            duration: 1000
                        });
                    }
                }).catch(response => {
                    that.$hideLoading();
                });
            },
        },

        onLoad() { this.$commonLoad.onload();
            let that = this;
            that.getSetting();
        }
    }
</script>

<style scoped lang="scss">
    .placeholder {
        height: #{154rpx};
        width: 100%;
    }

    .apply {
        position: fixed;
        bottom: 0;
        left: 0;
        z-index: 2;
        height: #{154rpx};
        width: 100%;
        background-color: #fff;
        padding-top: #{26rpx};
        padding-left: #{24rpx};
        .apply-btn {
            width: #{702rpx};
            height: #{88rpx};
            line-height: #{88rpx};
            border-radius: #{44rpx};
            text-align: center;
            color: #fff;
            font-size: #{32rpx};
        }
    }
</style>